// React基础组件
import React from 'react'
// dva 连接组件 - 连接route和model
import { connect } from 'dva'
// 引入antd的组件
import { Form, Popconfirm, Row, Col, Button, Input, Steps } from 'antd'
const Step = Steps.Step
//导入路由组件，用于跳转等
import { Link, hashHistory } from 'dva/router'
// 导入项目全局配置文件
import config from 'config/config'

// 引入model取值工具方法
import { mapStateToProps } from 'utils/view_utils'
// 当前组件样式
import styles from './couponAddStyle.less'
import { CollapsiblePanels } from 'widget/CollapsiblePanels/index'
import ListPage from 'widget/PageTmpl/ListPage'
import cx from 'classnames';
import { get, isArray, cloneDeep } from "lodash";
import CouponBasicView from './couponBasic/couponBasic'
import CouponSettingView from './couponSetting/couponSetting'
/**
 * description 路由视图及事件处理
 * dispatch 分发到models中的effects对应事件名
 * model 用于获取models中state定义的数据
 * form 表单对象
 */
const couponAddView = function ({ dispatch, model, form }) {
	// 表单的子函数
	const { resetFields, getFieldDecorator, validateFields, setFieldsValue } = form
	// 取出model对象，命名空间
	const { modelObj, namespace } = model
	let { currentStep } = modelObj

	const currentView = (name) => {
		let props = { dispatch, model }
		const viewMapper = {
			"basic": <CouponBasicView {...props} />, // 创建优惠券
			"setting": <CouponSettingView {...props} />
		}
		// updateModel(viewMapper[name].step, 'step')
		return viewMapper[name]
	}

	// 子组件步骤完成时调用, 切换子组件
	const changeView = (view, step) => {
		updateModel(view, 'currentViewName')
		updateModel(step, 'step')
	}

	return (
		<div className="public_listMain">
			{/* <div className="boxShadow" >
				<div className={styles.step}>
					<Steps current={currentStep}>
						<Step title="创建优惠券" />
						<Step title="配置优惠券" />
						<Step title="创建完成" />
					</Steps>
				</div>
			</div> */}
			{
				currentStep === 0 && currentView('basic')
			}
			{
				currentStep === 1 && currentView('setting')
			}
		</div>
	)
}

// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(couponAddView))
